{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="body"}
<div class="p-3">
    <h3 class="pb-3">领料单</h3>
    <table class="layui-hide" id="test" lay-filter="test"></table>
</div>

<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
<!--    <span id="printBtn" class="layui-btn layui-btn-sm" title="打印">打印</span>-->
  </div>
</script>

{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
	<script>
	const moduleInit = ['tool'];

    //表头工具栏事件

	function gouguInit() {
		var table = layui.table, tool = layui.tool, form = layui.form;
		layui.pageTable = table.render({
			elem: '#test'
			,toolbar: '#toolbarDemo'
			,title:'物料列表'
			,url: "/home/goodsCollar/info?id="+"{$_GET.id}"
			,page: false
			,cellMinWidth: 80
			,cols: [
                // [
                //     {title: 'WINFAN 苏州顶裕节能设备有限公司', colspan: 7, align:'center', style:'border-style:none; font-size:24px;'}
                // ],
                [
                    {title: '{$entName} - 领料单', colspan: 7, align:'center', style:'border-style:none; font-size:20px;'}
                ],
                [
                    {title: '领用部门：{$depName}', colspan: 2, style:'border-style:none'},
                    {title: '制工单号：{$outCode}', colspan: 2, style:'border-style:none'},
                    {title: '日期：{$outTime}', colspan: 3, style:'border-style:none'}
                ],
                [
                    {field:'number',width:80, title: '项次', align:'center'}
                    ,{field:'code', title: '物料编码' }
                    ,{field:'name',title: '品名'}
                    ,{field:'version',title: '规格'}
					,{field:'num',width:100,title: '数量'}
					,{field:'unit',width:100,title: '单位'}
					,{field:'remark',title: '备注'}
				]
            ],
            done: function (res) {
                var tbodyElem = $('.layui-table-body tbody');
                var trElem = $('<tr>');
                trElem.append('<td colspan="2" height="38px" align="center">物料用途：</td>');
                trElem.append('<td colspan="5"></td>');
                tbodyElem.append(trElem);

                trElem = $('<tr>');
                trElem.append('<td colspan="2" height="42px" style="border-style:none">核准：</td>');
                trElem.append('<td style="border-style:none">仓库：</td>');
                trElem.append('<td colspan="2" style="border-style:none">审查：</td>');
                trElem.append('<td colspan="2" style="border-style:none">领用人：</td>');
                tbodyElem.append(trElem);
                return res;
            }
        });

        // 打印表格内容
        document.getElementById('printBtn').onclick = function(){
            // 获取表格的HTML内容
            var tableHTML = document.getElementById('test').outerHTML;
            // 创建一个新的窗口或标签页来打印
            var printWindow = window.open('', '_blank');
            printWindow.document.write('<html><head><title>打印</title>');
            printWindow.document.write('</head><body >');
            printWindow.document.write(tableHTML);
            printWindow.document.write('</body></html>');
            printWindow.document.close();

            // 设置新窗口的焦点并打印
            printWindow.focus();
            printWindow.print();

            // 关闭新窗口
            printWindow.close();
        };

		}
	</script>
{/block}
<!-- /脚本 -->